﻿@import 'variables';
/* *** Overall APP Styling can go here ***
   --------------------------------------------
   Note: This Component has ViewEncapsulation.None so the styles will bleed out

*/

body {
  line-height: 18px;
  padding-top: $header-height;
}

.body-content {
  margin: auto;
}

h1 {
  border-bottom: 3px theme-color('accent') solid;
  font-size: 24px;
}

h2 {
  font-size: 20px;
}

h1,
h2,
h3 {
  padding: 3px 0;
}

ul {
  padding: 10px 25px;
}

ul li {
  padding: 5px 0;
}

blockquote {
  margin: 25px 10px;
  padding: 10px 35px 10px 10px;
  border-left: 10px color('green') solid;
  background: $gray-100;
}

blockquote a,
blockquote a:hover {
  color: $green;
}

@include media-breakpoint-up(lg) {
  body {
    padding-top: 30px;
  }
  .body-content {
    margin-left: $menu-max-width;
  }
  h1 {
    border-bottom: 5px #4189c7 solid;
    font-size: 36px;
  }
  h2 {
    font-size: 30px;
  }
  h1,
  h2,
  h3 {
    padding: 10px 0;
  }
}
